<script lang="ts" setup>
import { DictData } from "@/store";
import { PropType } from "vue";

defineOptions({
  name: "DictTag",
});

//PropType 指定 props的类型
const props = defineProps({
  modelValue: {
    type: String,
    default: "",
  },
  options: {
    type: Array as PropType<DictData[]>,
    default() {
      return [];
    },
  },
});

const current = computed(() => {
  return (
    props.options.find((item) => item.value === props.modelValue) || {
      label: "",
      value: "",
      cssClass: "primary",
    }
  );
});
</script>

<template>
  <el-tag :typ="current.cssClass">{{ current.label }}</el-tag>
</template>
